<template>
  <div class="hello">
    <h1>{{ message }}</h1>
    <button @click="getPing">Test Ping</button>
    <button @click="testSuccess">Test Success Response</button>
    <button @click="testFailure">Test Failure Response</button>
  </div>
</template>

<script>
import { getPing, getSuccessResponse, getFailureResponse } from '@/api/apiTestService';

export default {
  name: 'HelloWorld',
  data() {
    return {
      message: 'Ready to test API calls'
    };
  },
  methods: {
    /** 查询菜单下拉树结构 */
    getPing() {
      getPing().then(response => {
        this.message = `Success Response: ${response.data.message}`;
      });
    },
    testSuccess() {
      getSuccessResponse().then(response => {
        this.message = `Success Response: ${response.data.message}`;
      });
    },
    testFailure() {
      getFailureResponse().then(response => {
        this.message = `Success Response: ${response.data.message}`;
      });
    },
  }
};
</script>

<style scoped>
/* Add your styles here */
</style>